

import React from "react";

/**
 * HeartIcon component.
 *
 * @param {string} [fill='currentColor'] - Fill color.
 * @param {boolean} [filled=false] - Determines whether the heart should be filled or not.
 * @param {number|string} [size] - Icon size. Overrides width and height if provided.
 * @param {number|string} [height] - Icon height. Used only if size is not provided.
 * @param {number|string} [width] - Icon width. Used only if size is not provided.
 * @param {string} [label] - Label for the icon. Not currently used, but can be in the future.
 * @param {object} [props] - Additional props to be passed to the SVG element.
 */
 const HeartIcon = ({
  fill = "currentColor",
  filled = false,
  size = 24,
  height = 24,
  width = 24,
  label = "",
  ...props
}) => {
  return (
    <svg
      width={size || width || 24}
      height={size || height || 24}
      viewBox="0 0 24 24"
      fill={filled ? fill : "none"}
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M12.62 20.81c-.34.12-.9.12-1.24 0C8.48 19.82 2 15.69 2 8.69 2 5.6 4.49 3.1 7.56 3.1c1.82 0 3.43.88 4.44 2.24a5.53 5.53 0 0 1 4.44-2.24C19.51 3.1 22 5.6 22 8.69c0 7-6.48 11.13-9.38 12.12Z"
        stroke={fill}
        strokeWidth={1.5}
        strokeLinecap="round"
        strokeLinejoin="round"
      />
    </svg>
  );
};
export default HeartIcon;